<template>
	<!-- 新建来料报检单 -->
	<view>
		<u-toast ref="uToast"></u-toast><!-- 弹窗 -->
		<!-- 表单 -->

		<!-- :rules表单校验规则，通过rules属性来指定表单项的校验规则 ref:给表单设置一个引用名称 errorType设置表单错误提示方式
		label-position表单项的标签位置为左对齐 label-align设置标签文字对齐方式为左对齐-->
		<u-form :model="dataForm" :rules="rules" ref="dataForm" :errorType="['toast']" label-position="left"
			label-width="150" label-align="left" class="shzy-form">

			<!-- 物料 -->
			<!-- 下拉框组 -->
			<u-form-item label="物料" prop="materialCode" label-width="180" required class="form-item"
				onscroll="handleScroll">
				<shzy-select v-model="dataForm.materialCode" placeholder="请选择物料" :options="materialList"
					 lazy :props="{label:'name',value:'code'}" isConcat></shzy-select>
			</u-form-item>

			<!-- 供应商 -->
			<u-form-item label="供应商" prop="supplier" label-width="180" required class="form-item">
				<shzy-select v-model="dataForm.supplier" placeholder="请选择供应商" :options="supplierList"
				 lazy :props="{label:'name',value:'code'}"></shzy-select>
			</u-form-item>

			<!-- 来料数量-->
			<!-- 数量输入/增减 step:步增长,每次增加多少[可以填小数0.01],positive-integer是否是正整数 -->
			<u-form-item label="来料数量" prop="incomingQty" label-width="180" required>
				<u-number-box v-model="dataForm.incomingQty" :min="0"  :step="1" :input-width="120"
					:positive-integer="false" :input-height="60"></u-number-box>
			</u-form-item>

			<!-- 批次号 -->
			<u-form-item label="批次号" prop="batchNumber" label-width="180" required class="form-item">
				<u-input v-model="dataForm.batchNumber" placeholder="请输入"></u-input>
			</u-form-item>

			<!-- 采购订单号 -->
			<u-form-item label="采购订单号" prop="orderNo" label-width="180" required class="form-item">
				<u-input v-model="dataForm.orderNo" placeholder="请输入"></u-input>
			</u-form-item>
			
			<!-- 检验员 -->
			<u-form-item label="检验员" prop="employeeName" label-width="180" class="form-item">
				<shzy-org-select v-model="dataForm.employeeCode" :options="employeeNameList"
					@changeFun="employeeChange"></shzy-org-select>
			</u-form-item>
			
			<!-- 检验类型 -->
			<u-form-item label="检验类型" prop="inspectType" label-width="180" class="form-item">
				<shzy-select v-model="dataForm.inspectType" placeholder="请选择检验类型" :options="inspectType"
				:props="{label:'fullName',value: 'enCode'}"></shzy-select>
			</u-form-item>

			<!-- lable:标签名 prop:校验规则 required:是否必填 label-width:表单项标签的宽度 placeholder:输入框的占位符文本-->
			<!-- 备注 -->
			<u-form-item label="备注" prop="remark" label-width="180" class="form-item">
				<u-input v-model="dataForm.remark" placeholder="请输入"></u-input>
			</u-form-item>

		</u-form>

		<!-- 按钮 -->
		<view class="buttom-actions">
			<u-button class="buttom-btn" type="primary" @click="submit">
				新增
			</u-button>
		</view>


	</view>
</template>

<script>
	import {
		GetMaterialGroup, // 获取物料组
		GetSupplier, // 获取供应商
		GetInspectType, // 获取检验项
		SubmitInspection // 提交
	} from '@/api/q1/business/inspection/inspSub.js' // 引入报检单接口js
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import {
		data
	} from '@/uview-ui/libs/mixin/mixin'
	// } from '../../../uview-ui/libs/mixin/mixin';
	export default {
		data() {
			return {
				dataForm: {
					materialCode: "", // 物料号
					supplier: "", // 供应商
					incomingQty: "", // 来料数量
					batchNumber: "", // 批次号
					orderNo: "", // 采购订单号
					inspectType: "", // 检验类型
					remark: "", // 备注	
					// employeeCode: "", // 用户编号
					// employeeName: "" // 用户名
				},
				/** 想要成功执行rules里的校验，需要注意：确保规则对象的字段名与表单项的prop属性保持一致，例如：v-model="dataForm.remark" prop="remark"
					并且在钩子函数onReady中调用setRules方法设置校验规则
				*/
				rules: {
					batchNumber: [{
						required: true,
						message: '请输入批次号',
						trigger: 'blur',
					}],
					orderNo: [{
						required: true,
						message: '请输入采购订单号',
						trigger: 'blur',
					}],
					incomingQty: [{
						required: true,
						message: '请输入来料数量',
						trigger: 'change',
						type: 'any'
					}],
					materialCode: [{
						required: true,
						message: '请选择一个物料',
						trigger: 'change',
					}],
					supplier: [{
						required: true,
						message: '请选择一个供应商',
						trigger: 'change',
					}],
				},
				isLoading: false, // 是否正在加载数据
				scrollLoading: false, // 是否正在滚动加载数据
				// 物料数据
				materialList: [], // 物料列表

				// 供应商数据
				supplierList: [], // 供应商列表
		
				//  检验类型数据
				inspectType: [], // 检验类型
				employeeNameList: [], // 检验员
			}
		},

		// 获取全局变量
		mounted() {
			this.getSelect(); // 懒加载
		},
		beforeDestroy() {
			// // 移除滚动事件监听
			// window.removeEventListener('scroll', this.handleScroll);
		},
		onReady() {
			this.$refs.dataForm.setRules(this.rules);
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title: '新建报检单'
			});
		},

		computed: {
			inspectTypeInit() {
				const currentPage = this.inspectTypeCurrentPage - 1;
				return this.inspectType[currentPage]?.data || [];
			},
		},
		methods: {
			
			// 获取检验员信息
			employeeChange(e, data) {
				console.log(data)
				this.dataForm.employeeCode = data.id;
				this.dataForm.employeeName = data.fullName;
			},
			
			// 获取下拉框所有数据
			getSelect() {

				// 查询物料组
				GetMaterialGroup().then(res => {
					this.materialList = res.data.list;
				}).catch((err) => {
					this.$refs.uToast.show({
						title: '异常:' + err,
						type: 'error'
					})
				});

				// 查询供应商
				GetSupplier().then(res => {
					
					this.supplierList = res.data.list; // 集合
				}).catch((err) => {
					this.$refs.uToast.show({
						title: '异常:' + err,
						type: 'error'
					})
				});

				// 查询检验类型
				GetInspectType().then(res => {
					this.inspectType = res.data.list; // 集合
				}).catch((err) => {
					this.$refs.uToast.show({
						title: '异常:' + err,
						type: 'error'
					})
				});

			},

			submit() {

				this.$refs.dataForm.validate(valid => {
					if (valid) {
						var data = [];
						data.push(this.dataForm);
						SubmitInspection(data).then(res => {

							if (res.code == 200 && (res.data == null || res.data == "")) {

								this.$refs.uToast.show({
									title: "提交成功",
									type: 'success',
									duration:1000,
									callback(){
										uni.navigateBack(); // 返回上一页
									}
								});
								
								return;
							}

							this.$refs.uToast.show({
								title: res.data,
								type: 'error'
							})
						})
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	.shzy-form {
		margin-left: 40rpx;
	}

	.form-item {
		margin-right: 40rpx;
	}
</style>